<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>考试统计</title>
    <link rel="stylesheet" href="/lims/layui/css/layui.css?20190817.1">
    <link rel="stylesheet" href="/lims/css/common.css">
    <link rel="stylesheet" href="/lims/css/eleTree.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css">
    <script src="/lims/layui/layui.js"></script>
    <script type="text/javascript" src="/lims/layui/global.js"></script>
    <script type="text/javascript" src="/js/jquery/jquery-1.9.1.js"></script>
    <script src="/lib/jQuery-File-Upload-master/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/jQuery-File-Upload-master/jquery.ui.widget.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/jQuery-File-Upload-master/jquery.iframe-transport.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/jQuery-File-Upload-master/jquery.fileupload.js" type="text/javascript" charset="utf-8"></script>
    <script src="/js/ajaxupload.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lib/jquery.form.min.js"></script>
    <script src="/js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <script src="/lims/js/common.js?v=20190726" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="/lib/layui/layui/lay/dest/layui.all.js"></script>
    <script src="/lib/layui/layui/layui.js"></script>
    <style>
        html, body {
            width: 99%;
            height: 99%;
        }

        .layui-tab {
            height: 98%;
        }

        .layui-tab-content {
            height: calc(100% - 50px)
        }

        .layui-tab-item, .layui-card {
            height: 100%;
        }
    </style>

</head>
<body style="background-color: white;padding: 5px">
<div class="layui-tab">
    <ul class="layui-tab-title">
        <li class="layui-this">考试统计</li>

    </ul>
    <div class="layui-tab-content">

        <div class="layui-card-body" style="padding: 15px 0px 0px 0px ;">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <div class="layui-inline" >
                        <label class="layui-form-label" style="width:90px;">部门或姓名：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="" id="userName" lay-filter="userName" required  lay-verify="required" placeholder="请输入部门或姓名" autocomplete="off" class="layui-input">
                            <input type="hidden" name="trainCenter" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline" >
                        <label class="layui-form-label" style="width:140px;">试卷名称或试卷分数：</label>
                        <div class="layui-input-inline" >
                            <input type="text" name="" id="resTotle" lay-filter="tree" required  lay-verify="required" placeholder="请输入试卷名称或试卷分数" autocomplete="off" class="layui-input">
                            <input type="hidden" name="trainCenter" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <input type="text" class="layui-input  timeStr" id="joinTimeStr" placeholder="开始时间" >
                    </div>
                    <div class="layui-inline">
                        ——
                    </div>
                    <div class="layui-inline">
                        <input type="text" class="layui-input  timeStr" id="joinTimeEnd" placeholder="结束时间" >
                    </div>
                    <div class="layui-inline">
                        <select id="orderType" type="button" class="layui-btn search">
                            <option value="">倒序排序</option>
                            <option value="1">正序排序</option>
                        </select>
                    </div>
                    <div class="layui-inline">
                        <button type="button" class="layui-btn search">搜索</button>
                    </div>
                </div>
            </form>
            <div id="action_actionView"></div>
        </div>
        <div class="layui-tab-item layui-show">
            <table id="Settlement1" lay-filter="SettlementFilter1"></table>
        </div>

    </div>
</div>

<script type="text/html" id="barOperation">
    <a class="layui-btn layui-btn-xs layui-bg-orange" lay-event="grade" id="grade">查看详情</a>
</script>
<script type="text/javascript">
    layui.use('element', function () {
        var $ = layui.jquery
            , element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

    });
    var first;
    var sencond;
    layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'], function () {
        var laydate = layui.laydate //日期
            , table = layui.table //表格
        laydate.render({
            elem: '#joinTimeStr' //指定元素
        });
        laydate.render({
            elem: '#joinTimeEnd' //指定元素
        });
        //执行一个 table 实例
        var tableObj=table.render({
            elem: '#Settlement1'
            , url: '/exaExamination/selectAllSheet' //数据接口
            , title: '报名信息表'
            , page: true //开启分页
            , toolbar: 'default ' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
            , cols: [[ //表头
                {field: 'signupId', title: 'ID', sort: true, fixed: 'left', hide: true}
                , {field: 'userName', title: '姓名',}
                , {field: 'deptName', title: ' 部门'}
                , {field: 'categoryName', title: '品类'}
                , {field: 'brandName', title: '品牌'}
                , {field: 'pName', title: '试卷名称',}
                , {field: 'resTotle', title: ' 考试分数'}
                ,{field: 'resTotle', title: '状态',templet:function(d){
                  if(d.passingScore == undefined){
                         return ''
                    }else   if(d.resTotle <d.passingScore){
                        return '考试未通过'
                    }else if(d.resTotle>=d.passingScore){
                        return '考试通过'
                    }
                }}
                , {field: 'joinTime', title: '考试时间'}
                ,{fixed: 'right',width:100, title: '操作',align:'center', toolbar: '#barOperation'}
            ]]
        });
        $('div[title="导出"]').click(function () {
            $(this).attr('lay-event','ads')
            window.location.href = "/exaExamination/selectAllSheet?export=1"
        })
        //搜索
        $('.search').click(function(){
            var  currentPage=1;
            table.reload('Settlement1',{
                url : '/exaExamination/selectAllSheet',
                data:{page:currentPage},
                page:{
                    curr:currentPage
                },
                where:{
                    userName:$('#userName').val(),
                    pName:$('#resTotle').val(),
                    joinTimeStr:$('#joinTimeStr').val(),
                    joinTimeEnd:$('#joinTimeEnd').val(),
                    orderType:$('#orderType').val()
                }
            })
        })
        table.on('tool(SettlementFilter1)', function(obj){//注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            if(layEvent === 'grade'){
                window.open("/tbExamList/testPaperExa?pId="+obj.data.pId+'&uId='+obj.data.uid+'&scoreId='+obj.data.scoreId)
            }
        });
    });

</script>

</body>


</html>